<template>
  <view class="list-view">
    <view class="header">
      <text class="header-title">到货单列表</text>
    </view>

    <view class="list-content">
      <u-list @scrolltolower="scrollTolower" @scrollWithAnimation="true" :key="listKey">
        <u-list-item v-for="(item, index) in arrivalList" :key="index" class="arrival-item">
          <view class="item-card">
            <view class="item-header">
              <text class="item-code">{{ item.cCode }}</text>
              <u-tag :text="item.status || '开立'" type="primary" size="mini" />
            </view>

            <view class="item-details">
              <view class="detail-row">
                <text class="detail-label">供应商:</text>
                <text class="detail-value">{{ item.vName }}</text>
              </view>

              <view class="detail-row">
                <text class="detail-label">制单人:</text>
                <text class="detail-value">{{ item.makeMan }}</text>
              </view>

              <view class="detail-row">
                <text class="detail-label">到货日期:</text>
                <text class="detail-value">{{ item.dDate }}</text>
              </view>

              <view class="detail-row" v-if="item.details && item.details.length">
                <text class="detail-label">子表数量:</text>
                <text class="detail-value">{{ item.details.length }}</text>
              </view>
            </view>

            <view class="item-actions">
              <u-button type="primary" size="mini" @click="selectArrival(item)">查看详情</u-button>
              <u-button v-if="!item.status || item.status === '开立'" type="success" size="mini" @click="auditArrival(item)">审核</u-button>
              <u-button type="error" size="mini" @click="deleteArrival(item)">删除</u-button>
            </view>
          </view>
        </u-list-item>
      </u-list>
    </view>

    <!-- 底部按钮 -->
    <view class="fixed-bottom">
      <u-button @click="scanCode" class="scan-btn">扫码添加</u-button>
    </view>

    <u-loading-icon :show="loading" text="加载中" textSize="18"></u-loading-icon>
  </view>
</template>

<script>
import { deleteArrivalVouch, auditArrivalVouch } from "@/api/work/wareHourse/arrival.js";
import user from "@/store/modules/user";

export default {
  name: "ArrivalList",
  props: {
    arrivalList: {
      type: Array,
      default: () => []
    },
    listKey: {
      type: Number,
      default: 0
    },
    loading: {
      type: Boolean,
      default: false
    }
  },
  methods: {
    // 加载开立状态的到货单列表
    loadOpenArrivalList() {
      this.$emit('loadOpenArrivalList');
    },

    // 选择一个到货单进行处理
    selectArrival(item) {
      this.$emit('selectArrival', item);
    },

    // 扫码添加物料
    scanCode() {
      // 使用摄像头扫描二维码
      uni.scanCode({
        success: (res) => {
          if (res.result) {
            // 将扫码结果传递给父组件处理
            this.$emit('scanCode', res.result);
          } else {
            this.$modal.showToast('扫码解析失败');
          }
        },
        fail: (err) => {
          this.$modal.showToast('扫码失败: ' + (err.errMsg || err.message || '未知错误'));
        }
      });
    },

    scrollTolower() {
      // 滚动加载逻辑可以在这里实现
      this.$emit('scrollToLower');
    },

    // 删除到货单
    deleteArrival(item) {
      // 检查是否有子表数据
      if (item.details && item.details.length > 0) {
        this.$modal.showToast('只有空单据才能删除');
        return;
      }

      // 确认删除
      this.$modal.confirm('确定要删除该到货单吗？').then(() => {
        deleteArrivalVouch(item.id).then(response => {
          if (response.code === 200) {
            this.$modal.showToast('删除成功');
            // 重新加载列表
            this.loadOpenArrivalList();
          } else {
            this.$modal.showToast('删除失败: ' + (response.msg || ''));
          }
        }).catch(err => {
          this.$modal.showToast('删除失败: ' + err);
        });
      }).catch(() => {
        // 用户取消删除
      });
    },

    // 审核到货单
    auditArrival(item) {
      // 确认审核
      this.$modal.confirm('确定要审核该到货单吗？').then(() => {
        const cverifier = user.state.nickName;
        auditArrivalVouch(item.cCode, cverifier).then(response => {
          if (response.code === 200) {
            this.$modal.showToast('审核成功');
            // 更新列表状态
            item.status = '已审核';
            // 重新加载列表
            this.loadOpenArrivalList();
          } else {
            this.$modal.showToast('审核失败: ' + (response.msg || ''));
          }
        }).catch(err => {
          this.$modal.showToast('审核失败: ' + err);
        });
      }).catch(() => {
        // 用户取消审核
      });
    }
  }
};
</script>

<style scoped>
.list-view .header {
  padding: 20rpx 0;
  text-align: center;
  border-bottom: 1rpx solid #eee;
  margin-bottom: 20rpx;
}

.header-title {
  font-size: 36rpx;
  font-weight: bold;
  color: #333;
}

.arrival-item {
  margin-bottom: 20rpx;
}

.item-card {
  background: #fff;
  border-radius: 12rpx;
  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
  padding: 24rpx;
  transition: all 0.3s;
}

.item-card:hover {
  box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.1);
  transform: translateY(-4rpx);
}

.item-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16rpx;
}

.item-code {
  font-size: 30rpx;
  font-weight: bold;
  color: #333;
}

.detail-row {
  display: flex;
  margin-bottom: 12rpx;
}

.detail-label {
  width: 160rpx;
  font-size: 26rpx;
  color: #666;
}

.detail-value {
  flex: 1;
  font-size: 26rpx;
  color: #333;
}

.item-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 20rpx;
  gap: 20rpx;
}

/* 底部按钮样式 */
.fixed-bottom {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 20rpx;
  text-align: center;
  background-color: #fff;
  z-index: 999;
  box-shadow: 0 -4rpx 12rpx rgba(0, 0, 0, 0.05);
  display: flex;
  justify-content: space-between;
}

.scan-btn {
  flex: 1;
  border-radius: 50rpx;
  height: 80rpx;
  margin-right: 10rpx;
}
</style>
